<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Teaching Material</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="../layui.css" media="all">
  <link rel="stylesheet" href="../MDASS.css" media="all">
</head>
<body style="overflow-y: scroll;"> 
<div class="layui-tab"><!-- TAB页 -->
  <ul class="layui-tab-title">
    <li class="layui-this">未申报</li>
    <li>已申报</li>
    <li>已征订</li>
  </ul>
  <div class="layui-tab-content">
<!-- TAB1 -->
    <div class="layui-tab-item layui-show">
    <div style="margin-bottom: 5px;">          
    <ins class="adsbygoogle" style="display:inline-block;width:970px;height:90px" data-ad-client="ca-pub-6111334333458862" data-ad-slot="3820120620"></ins>
    </div>
    <div class = "courseTable1">
      <table class="layui-table" id = "courseData1" lay-filter="demo" lay-data="{id: 'courseTable1'}"></table>  
    </div>
    </div>
<!-- TAB2 -->
    <div class="layui-tab-item">
    <div style="margin-bottom: 5px;">          
    <ins class="adsbygoogle" style="display:inline-block;width:970px;height:90px" data-ad-client="ca-pub-6111334333458862" data-ad-slot="3820120620"></ins>
    </div>
    <div class = "courseTable2">
      <table class="layui-table" id = "courseData2" lay-filter="demo2" lay-data="{id: 'courseTable2'}"></table>  
    </div>
    </div>
<!-- TAB3 -->
    <div class="layui-tab-item">
      <div style="margin-bottom: 5px;">          
      <ins class="adsbygoogle" style="display:inline-block;width:970px;height:90px" data-ad-client="ca-pub-6111334333458862" data-ad-slot="3820120620"></ins>
      </div>
      <div class = "courseTable3">
        <table class="layui-table" id = "courseData3" lay-filter="demo3" lay-data="{id: 'courseTable3'}"></table>  
      </div>
    </div>
  </div>
</div> 
<!-- 数据表格安修 -->
<script type="text/html" id="barDemo">
  <a data-method="setTop" class="layui-btn layui-btn-sm"  lay-event="apply" >申报</a>
<!--   <a class="layui-btn layui-btn-xs" lay-event="edit">保存</a>
  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> -->
</script>  

<script type="text/html" id="barDemo2">
  <a data-method="setTop2" class="layui-btn layui-btn-sm"  lay-event="reApply" >撤销</a>
  <a data-method="setTop2" class="layui-btn layui-btn-sm"  lay-event="solicit">征订</a>
<!--   <a class="layui-btn layui-btn-xs" lay-event="edit">保存</a>
  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> -->
</script> 

<script type="text/html" id="barDemo3">
  <a data-method="setTop3" class="layui-btn layui-btn-sm"  lay-event="solicitUitl" value='{{d.status}}' {{ d.status == '未审核' ? '' : 'style="display:none"' }}>修改</a>
  <a data-method="setTop3" class="layui-btn layui-btn-sm"  lay-event="reSolicit" value='{{d.status}}' {{ d.status == '未审核' ? '' : 'style="display:none"' }}>撤销</a>
</script>            
          
<script src="../layui.js" charset="utf-8"></script><!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script src="../jquery-3.1.1.min.js"></script>
<script>
  layui.use(['table','layer','element'], function(){

    var table = layui.table;
    var layer = layui.layer;
    var element = layui.element;
    var loginName= "杨振刚";
    var loginSerial="30000001";
    var pageNum = 0;
    //未申报表格
    table.render({
          id:'courseTable1',
          elem: '#courseData1',
          url:'/admin/mdass/util',
          method:'post',
          where:{"loginName":loginName,"loginSerial":loginSerial,"sign":1},
          done: function(res, curr, count){
            pageNum = curr;
              //如果是异步请求数据方式，res即为你接口返回的信息。
              //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
          },
          cols:[[//标题栏
          {field:'id', width:150,title:'编号'},
          {field:'courseSerial',width:150,title:'课程编码',sort:true},
          {field:'courseName',title:'课程名称'},
          {field:'tname',width:150,title:'授课教师'},
          {field:'classTrem',title:'上课学期'},
          {fixed: 'right', width:100, align:'center',title:'功能', toolbar: '#barDemo'}
          ]],
          skin:'line',
          even: true,
          page:true,
          limits:[5,10,15],
          limit:5,//limit:5 每页显示的数量
    });
    table.on('tool(demo)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
          var data = obj.data; //获得当前行数据
          var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
          var tr = obj.tr;

          //获得当前行 tr 的DOM对象
          if(obj.event === 'apply'){
            console.log(data.id);
            layer.open({
                type: 2 ,//此处以iframe举例
                title: '申报图书',
                area: [' 800px','500px'],
                shade: 0,
                maxmin: true,
                offset: 'auto',
                content: 'addMaterial.html?id='+data.id,
                btn: ['关闭'], //只是为了演示,
                yes: function(){
                  layer.closeAll();
                },
                zIndex: layer.zIndex, //重点1
                success: function(layero){
                  layer.setTop(layero); //重点2
                },
                cancel: function(index, layero){ //关闭窗户回调
                  if(confirm('确定要关闭么')){ //只有当点击confirm框的确定时，该层才会关闭
                    layer.close(index)
                  }
                  return false;  
                }
            });
          }
        });
    //已申报表格
    table.render({
          id:'courseTable2',
          elem: '#courseData2',
          url:'/admin/mdass/util',
          method:'post',
          where:{"loginName":loginName,"loginSerial":loginSerial,"sign":2},
          done: function(res, curr, count){
            pageNum = curr;
              //如果是异步请求数据方式，res即为你接口返回的信息。
              //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
              /*      console.log(res);*/
            },
          cols:[[//标题栏
          {field:'id', width:100,title:'编号'},
          {field:'courseSerial',width:150,title:'课程编码',sort:true},
          {field:'courseName',title:'课程名称'},
          {field:'tname',width:150,title:'授课教师'},
          {field:'classTrem',title:'上课学期'},
          {fixed: 'right', width:150, align:'center',title:'功能', toolbar: '#barDemo2'}
          ]],
          skin:'line',
          even: true,
          page:true,
          limits:[5,10,15],
          limit:5,//limit:5 每页显示的数量
        });
      table.on('tool(demo2)', function(obj){
          var data = obj.data; //获得当前行数据
          var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
          //判断是否已征订
          var existing = 0;
          if(obj.event ==="reApply"){
            $.ajax({
              url:"/admin/detials/byCourseName",
              async:false,
              type:"post",
              dataType:"json",
              data:{"courseName":data.courseName},
              success:function(result){
                if(result.data!=null){
                  existing = 1
                }
                if(existing===0){
                  layer.confirm('真的撤销么', function(index){
                  obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                  layer.close(index);
                  //向服务端发送删除指令
                  $.ajax({
                    url:"/admin/material/byCourseSerial",
                    async:false,
                    type:"post",
                    dataType:"json",
                    data:{"courseSerial":data.courseSerial},
                    success:function(result){
                      $.ajax({
                        url:"/admin/material/delete",
                        async:false,
                        type:"post",
                        dataType:"json",
                        data:{"id":result.data[0].id},
                        success:function(result){
                          alert("撤销成功");
                        },
                        error:function(result){
                          console.log("deleteCourse()出错了");
                        }
                      })
                    },
                    error:function(result){
                      console.log("reApply()出错了");
                    }
                  });
                  });
                }else{
                  layer.confirm("已征订不能撤销");
                }
              },
              error:function(result){
                console.log("getApplyByCourseNam()出错了");
              }
            });
          }
          if(obj.event =="solicit"){
            var solicited = 0;
            $.ajax({
              url:'/admin/detials/byCourseName',
              async:false,
              type:'post',
              dataType:'json',
              data:{"courseName":data.courseName},
              success:function(result){
                if(result.data!=null){
                    solicited =1;
                }
              },
              error:function(result){
                console.log(result);
              }
            });
            if(solicited ===1){
              layer.confirm("已征订");
            }else{
                layer.open({
                type: 2 ,//此处以iframe举例
                title: '征订图书',
                area: [' 800px','500px'],
                shade: 0,
                maxmin: true,
                offset: 'auto',
                content: 'addApply.html?id='+data.id,
                btn: ['关闭'], //只是为了演示,
                yes: function(){
                  layer.closeAll();
                },
                zIndex: layer.zIndex, //重点1
                success: function(layero){
                  layer.setTop(layero); //重点2
                },
                cancel: function(index, layero){ //关闭窗户回调
                  if(confirm('确定要关闭么')){ //只有当点击confirm框的确定时，该层才会关闭
                    layer.close(index)
                  }
                  return false;  
                }
            });
          }
        }
      });
      //已征订
      table.render({
        id:'courseTable3',
        elem: '#courseData3',
        url:'/admin/apply/byTSerial',
        method:'post',
        where:{"tSerial":loginSerial},
        done: function(res, curr, count){
          pageNum = curr;
          //如果是异步请求数据方式，res即为你接口返回的信息。
          //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
          /*      console.log(res);*/
        },
        cols:[[//标题栏
        {field:'id', width:100,title:'编号'},
        {field:'applySerial',title:'申请编号',sort:true},
        {field:'applyTime',title:'申请时间',sort:true},
        {field:'tSerial',title:'教师工号'},
        {field:'status',title:'状态'},
        {fixed: 'right', width:150, align:'center',title:'功能', toolbar: '#barDemo3'}
        ]],
        skin:'line',
        even: true,
        page:true,
        limits:[5,10,15],
        limit:5,//limit:5 每页显示的数量
      });
      table.on('tool(demo3)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
          var data = obj.data; //获得当前行数据
          var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
          var tr = obj.tr;//获得当前行 tr 的DOM对象
          if(obj.event == 'reSolicit'){
            if(data.status=="已审核"){
              layer.confirm("已经审核不能撤销");
            }else{
              layer.confirm('真的撤销么', function(index){
              obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
              layer.close(index);
              //向服务端发送删除指令
              console.log(data.applySerial);

              $.ajax({
                url:"/admin/detials/bySerial",
                async:false,
                type:"post",
                dataType:"json",
                data:{"applySerial":data.applySerial},
                success:function(result){
                  console.log(result.data.id);
                  $.ajax({
                    url:"/admin/detials/delete",
                    async: false,
                    type:"post",
                    dataType:"json",
                    data:{"id":result.data.id},
                    success:function(result){
                      console.log(data.id);
                      $.ajax({
                        url:"/admin/apply/delete",
                        async: false,
                        type:"post",
                        dataType:"json",
                        data:{"id":data.id},
                        success:function(result){
                          alert("撤销成功");
                        },
                        error:function(result){
                          console.log(result);
                        }
                      });
                    },
                    error:function(result){
                    console.log(result);
                    }
                  })
                 },
                error:function(result){
                  console.log("/admin/detials/bySerial出错");
                }
              });
              });
            }
          }
          else if(obj.event=='solicitUitl'){//触发修改功能
            if(data.status=="已审核"){
              layer.confirm("已经审核不能修改");
            }else{
                layer.open({
                type: 2 ,//此处以iframe举例
                title: '修改信息',
                area: [' 700px','450px'],
                shade: 0,
                maxmin: true,
                offset: 'auto',
                content: 'applyDetials.html?applySerial='+data.applySerial,
                btn: ['关闭'], //只是为了演示,
                yes: function(){
                  layer.closeAll();
                },
                zIndex: layer.zIndex, //重点1
                success: function(layero){
                  layer.setTop(layero); //重点2
                },
                cancel: function(index, layero){ //关闭窗户回调
                  if(confirm('确定要关闭么')){ //只有当点击confirm框的确定时，该层才会关闭
                    layer.close(index)
                  }
                  return false;  
                }
            });
            }
          }
        });

  });
</script>

</body>
</html>